<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
    HttpSession s = request.getSession();
%>
<body class="full" id="content">
<div id="alert"></div>
<div id="addTrainList"></div>
<div class="row">
    <div class="col-lg-12 col-md-12 col-sm-12 ">
        <form class="form-inline" role="form" id="selectUserVal">
            <div class="row">
                <div class="form-group inputselect col-lg-4">
                    <sec:authorize access="hasRole('ROLE_ADMIN')">
                        <button type="button" class="btn btn-info btn-sm " id="addTrain">
                            <span class="glyphicon glyphicon-user"></span> 新增考勤
                        </button>
                    </sec:authorize>
                </div>

                <div class="form-group inputselect col-lg-4">
                    <label >本人记录查询</label> <input type="text"
                                                class=" form-control " id="date" name="date"
                                                placeholder="请输入年月">
                    <button type="button" class="btn btn-success btn-sm " id="selectByVal1">
                        <span class="glyphicon glyphicon-user"></span> 搜索
                    </button>
                </div>
                <div class="form-group inputselect col-lg-4">
                        <label for="name">人员类型</label>
                        <select class="form-control " name="value1" id="value1">
                            <option value="">全部</option>
                            <option value="0">员工</option>
                            <option value="1">超级管理员</option>
                            <option value="2">系统管理员</option>
                            <option value="3">教师</option>
                            <option value="4">招聘人员</option>
                            <option value="5">系主任</option>
                        </select>
                            <button type="button" class="btn btn-success btn-sm " id="selectByVal">
                                <span class="glyphicon glyphicon-user"></span> 搜索
                            </button>
                    </div>

                </div>


        </form>
        <form class="form-inline" role="form"></form>
        <div class="table-responsive " style="margin-left: 3%;">
            <table class="table table-hover tablefont">
                <tbody id="tableList">
                </tbody>
            </table>
            <div style="bottom: 10%">
                <div id="paging" style="text-align: center; margin-left: 25%;">
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    //增加
    var authority = "${authority}";
    var value1="";
    var datell="";
    $("#selectByVal").click(
        function() {
            var user = getFormData($("#selectUserVal"));
            var pagenumber = $("#paging").attr('pagenumber');
            selectList(user.date);
        });

    $("#selectByVal1").click(
        function() {
            var user = getFormData($("#selectUserVal"));
            var pagenumber = $("#paging").attr('pagenumber');
            selectList(user.value1);
        });

    //增加
    $("#addTrain").click(function(){
        $("#addTrainList").load("WEB-ROOT/html/Attendance/addAttendance.jsp",function(){
            $("#addModel").modal({
                keyboard: true
            });
        })
    });
    var pageSize = 8;
    var dataUrl = "${pageContext.request.contextPath}/attendance";

    selectList= function(value,date){
        value1=value;
        datell=date;
        initPage("0",pageSize,dataUrl,value1,datell);
    };
    initPage("0", pageSize, dataUrl);
    function initPage(num, ps, url,value1,date) {
        if(value1==undefined){
            value1="";
        }
        if(date==undefined){
            date="";
        }
        $.ajax({
            url : url,
            type : "GET",
            data : "currentPage=" + num + "&pageSize=" + ps+"&value="+value1+"&date="+date,
            contentType : "application/json;charset=utf-8",
            success : function(msg) {
                initTable(msg);
                color();
                if("[ROLE_USER]"==authority){
                }
                var i=1;
                var sqlData;
                var dateR;
                //表格用的日期格式
                var newDate = new Date();
                //alert($('#tableList tr:eq(1) td:eq(4)').text());
                while($('#tableList tr:eq('+ i + ') td:eq(3)').text()!=""){
                    sqlData = $('#tableList tr:eq('+ i + ') td:eq(3)').text();
                    newDate.setTime(sqlData);
                    dateR = getMyDate(newDate);
                    $('#tableList tr:eq('+ i + ') td:eq(3)').text(dateR);
                    i++;
                }
            },
            error : function(e) {
                console.log(e)
                alert("失败");
            }
        });
    }
    //初始化表格
    function initTable(data) {
        var obj = data.extend.data.list;
        var page = data.extend.data;
        page.pageNumber=page.pageNUm;
        myTable = $
            .lTable(
                '#tableList',
                {
                    data : obj
                    ,
                    title : [
                        "id",
                        "userId",
                        "dateRecord",
                        "title1",
                        "title2",
                        "remark",
                        "operatorId",
                        ] ,
                    name : [ "编号", "员工编号", "日期", "上午考勤","下午考勤","说明","操作人" ],
                    tid : "id",
                    checkBox : "id"
                });
        $.lPaging('#paging',
            {
                pageNumber : page.pageNum
                ,
                totalPage : page.pages
                ,
                countSize : 8
                ,
                count : page.total
                ,
                inputSearch : false
                ,
                onPageChange : function(num) {
                    initPage(num, pageSize, dataUrl,value1);
                    color();
                }
            });
    }
</script>
<script>
    function color(){
        $("td").each(function(){
            var val = $(this).text();
            if(val=="正常"){
                $(this).css("color","green");
            }
            if(val=="迟到"){
                $(this).css("color","red");
            }
            if(val=="早退"){
                $(this).css("color","red");
            }
            if(val=="出差"){
                $(this).css("color","yellow");
            }
            if(val=="请假"){
                $(this).css("color","blue");
            }
            if(val=="旷工"){
                $(this).css("color","red");
            }
        });
    }
</script>
</body>





